﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>hosts文件管理</title>
    <script type="text/javascript" src="/js/layout.js"></script>
    <script type="text/javascript">
        function HostsViewModel() {
            var self = this;

            self.content = ko.observable('');
            self.list = ko.observableArray([]);
            self.selectedItems = ko.observableArray([]);
            self.name = ko.observable('');

            self.path = function (data, event) {
                var path = _eval('getHostsPath()');
                return path.replace(/\\/g, '/') + '/hosts';
            }

            self.readLocalFile = function (data, event) {
                var text = _eval('read("' + self.path() + '", "gb2312")');
                self.content(text);
            }

            self.db = function (data, event) {
                return sqlite.open(_eval('cwd()').replace(/\\/g, '/') + '/db/hosts.db');
            }

            self.add = function (data, event) {
                self.db().exec('SELECT COUNT(*) cnt FROM Hosts WHERE Name=?', [self.name()], function (ret) {
                    if (ret[0].cnt > 0) {
                        alert('[' + self.name() + ']已存在。');
                    } else {
                        self.db().exec('INSERT INTO Hosts(Name,Content) VALUES (?,?)', [self.name(), self.content()]);
                        self.refresh();
                    }
                });
            }

            self.update = function (data, event) {
                if (self.selectedItems().length > 0) {
                    var id = self.selectedItems()[0];
                    self.db().exec('SELECT COUNT(*) cnt FROM Hosts WHERE ID<>? AND Name=?', [id, self.name()], function (ret) {
                        if (ret[0].cnt > 0) {
                            alert('[' + self.name() + ']已存在。');
                        } else {
                            self.db().exec('UPDATE Hosts SET Name=?,Content=? WHERE ID=?', [self.name(), self.content(), id]);
                            self.refresh();
                        }
                    });
                }
            }

            self.remove = function (data, event) {
                if (self.selectedItems().length > 0 && confirm('确定要删除吗？')) {
                    var id = self.selectedItems()[0];
                    self.db().exec('DELETE FROM Hosts WHERE ID=?', [id]);
                    self.refresh();
                    self.content('');
                    self.name('');
                }
            }

            self.save = function (data, event) {
                if (confirm('确定要更新本地hosts文件吗？') && $.trim(self.content()).length > 0) {
                    var content = JSON.stringify(self.content());
                    content = content.substr(1, content.length - 2);
                    _eval('write("' + self.path() + '", "' + content + '", "gb2312")');
                }
            }

            self.refresh = function (data, event) {
                self.db().exec('SELECT * FROM Hosts', function (ret) {
                    self.list(ret);
                });
            }

            self.loadFromDb = function (data, event) {
                try {
                    if (self.selectedItems().length > 0) {
                        self.db().exec('SELECT * FROM Hosts WHERE ID=?', [self.selectedItems()[0]], function (ret) {
                            self.content(ret[0].Content);
                            self.name(ret[0].Name);
                        });
                    }
                } catch (ex) {
                }
            }
        }

        var model = new HostsViewModel();
        model.refresh();
        $(function () {
            $('table').height($(window).height() - $('table').offset().top - 10);
            ko.applyBindings(model);
        });
    </script>
</head>
<body>
    <fieldset>
        <legend>操作</legend>
        <input type="text" data-bind="value:name" style="width: 200px;" />
        <input type="button" value="添加" data-bind="click:add" />
        <input type="button" value="更新" data-bind="click:update" />
        <input type="button" value="删除" data-bind="click:remove" />
        <input type="button" value="更新本地hosts" data-bind="click:save" />
        <input type="button" value="读取本地hosts" data-bind="click:readLocalFile" />
    </fieldset>
    <table style="width: 100%;">
        <tr>
            <td style="width: 200px; height: 100%; vertical-align: top;">
                <select data-bind="event:{change:loadFromDb},options:list,optionsText:'Name',optionsValue:'ID',value:'ID',selectedOptions:selectedItems"
                    size="3" style="width: 100%; height: 100%;">
                </select>
            </td>
            <td style="height: 100%;">
                <textarea style="width: 100%; height: 100%;" data-bind="value:content"></textarea>
            </td>
        </tr>
    </table>
</body>
</html>
